<template>
	<view class="agentbox">
		<view class="topSearch">
			<uni-search-bar @confirm="search" v-model="searchValue" placeholder='搜索' @clear="clear"></uni-search-bar>
		</view>
		<view class="listcon">
			<scroll-view class="mallscorll" @scrolltolower="getList" scroll-y="true">
				<view class="tips">最近兑换掌柜</view>
				<view class="listUl">
					<view class="listLi" v-for="dt in 20" :key="dt">
						<view class="imgbox">
							<image class="img" src="http://api.ej12366.video/upload/5e8c1c87c2a20b38d871cec2/uglSQWOxC0kmudce6cESfexz.png" mode="aspectFill"></image>
						</view>
						<view class="info">
							<text class="phone">187****4567</text>
							<text class="yqm">124562</text>
						</view>
						<view class="licon">
							<image class="img" src="https://iyouhaolife-1316622368.cos.ap-chongqing.myqcloud.com/h5/static/imgs/a17.png" mode="widthFix"></image>
						</view>
					</view>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				searchValue:''
			}
		},
		methods: {
			search(){
				
			},
			clear(){
				this.searchValue = ''
			},
			getList(){
				
			}
		}
	}
</script>

<style lang="scss" scoped>
	.agentbox{
		display: flex;
		flex-flow: column;
		position:fixed;
		z-index: 1000;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		.topSearch{
			box-sizing: border-box;
			width: 100%;
		}
		.listcon{
			flex: 1;
			overflow: hidden;
			background-color: #fff;
			.mallscorll{
				height: 100%;
			}
			.tips{
				padding:30rpx 20rpx 10rpx 20rpx;
			}
			.listUl{
				padding: 20rpx 30rpx;
				.listLi{
					display: flex;
					font-size: 28rpx;
					border-top:1px solid #eee;
					padding: 20rpx 0;
					.imgbox{
						height: 120rpx;
						width: 120rpx;
						border-radius: 50%;
						overflow: hidden;
						.img{
							display: block;
							width: 100%;
							height: 100%;
						}
					}
					.info{
						flex: 1;
						line-height: 50rpx;
						padding: 10rpx 0 0 20rpx;
						.phone{
							display: block;
						}
						.yqm{
							display: block;
						}
					}
					.licon{
						display: flex;
						align-items: center;
						padding: 0 20rpx 0 0;
						.img{
							display: block;
							width: 20rpx;
						}
					}
				}
			}
		}
	}
	
</style>
